import 'package:flutter/material.dart';
import 'package:flutter_saixiaoli/pages/activity/menuItem.dart';
import 'package:flutter_saixiaoli/pages/activity/selectWidget.dart';
import 'package:flutter_saixiaoli/pages/home/underlinePainter.dart';
import 'package:flutter_saixiaoli/routes.dart';

class Tabs extends StatefulWidget {
  final TabController tabc;
  final List tabbarViewData;
  final List tabs;

  const Tabs({Key key, this.tabc, this.tabs, this.tabbarViewData})
      : super(key: key);

  @override
  _TabsState createState() => _TabsState();
}

class _TabsState extends State<Tabs> {
  int tabIndex = 0;
  String val = '1';

  valueChanged(v) {
    print(v);
  }

//活动的item
  goodsItemWidget() {
    return GestureDetector(
      onTap: () {
        Navigator.pushNamed(context, Routes.activeDetail);
      },
      child: Container(
        padding: EdgeInsets.only(bottom: 15),
        margin: EdgeInsets.only(bottom: 15),
        decoration: BoxDecoration(
            border: Border(
                bottom: BorderSide(color: Color.fromRGBO(238, 238, 238, 1)))),
        child: Row(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Container(
              width: 160,
              height: 100,
              margin: EdgeInsets.only(right: 10),
              decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(5),
                  color: Colors.greenAccent),
            ),
            Expanded(
              child: Container(
                height: 100,
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Text(
                      '徽杭古道2日游，驴友徒步+景 点路线',
                      style: TextStyle(fontSize: 14),
                    ),
                    Container(
                      child: Row(
                        children: [
                          Container(
                            child: Icon(
                              Icons.loyalty_outlined,
                              size: 14,
                              color: Color.fromRGBO(153, 153, 153, 1),
                            ),
                          ),
                          Container(
                            child: Text(
                              '10月-11月/共3期',
                              style: TextStyle(
                                  color: Color.fromRGBO(153, 153, 153, 1),
                                  fontSize: 12),
                            ),
                          ),
                        ],
                      ),
                    ),
                    Container(
                      child: Row(
                        children: [
                          Container(
                            child: Icon(
                              Icons.place,
                              size: 14,
                              color: Color.fromRGBO(153, 153, 153, 1),
                            ),
                          ),
                          Container(
                            child: Text(
                              '南京出发 I 3天',
                              style: TextStyle(
                                  color: Color.fromRGBO(153, 153, 153, 1),
                                  fontSize: 12),
                            ),
                          ),
                        ],
                      ),
                    ),
                    Container(
                      child: Row(
                        mainAxisAlignment: MainAxisAlignment.end,
                        crossAxisAlignment: CrossAxisAlignment.end,
                        children: [
                          Container(
                            child: Text(
                              '￥',
                              style: TextStyle(
                                  fontSize: 11,
                                  color: Color.fromRGBO(191, 55, 54, 1)),
                            ),
                          ),
                          Container(
                            child: Text(
                              '999',
                              style: TextStyle(
                                  fontSize: 16,
                                  fontWeight: FontWeight.bold,
                                  color: Color.fromRGBO(191, 55, 54, 1)),
                            ),
                          ),
                          Container(
                            margin: EdgeInsets.only(left: 3),
                            child: Text(
                              '起',
                              style: TextStyle(
                                  fontSize: 9,
                                  color: Color.fromRGBO(102, 102, 102, 1)),
                            ),
                          )
                        ],
                      ),
                    ),
                  ],
                ),
              ),
            )
          ],
        ),
      ),
    );
  }

//赛事的item
  matchItemWidget() {
  return  GestureDetector(
      onTap: () {
            Navigator.pushNamed(context, Routes.matchDetail);
      },
      child: Container(
        padding: EdgeInsets.only(bottom: 15),
        margin: EdgeInsets.only(bottom: 15),
        decoration: BoxDecoration(
            border: Border(
                bottom: BorderSide(color: Color.fromRGBO(238, 238, 238, 1)))),
        child: Row(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Container(
              width: 160,
              height: 100,
              margin: EdgeInsets.only(right: 10),
              decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(5),
                  color: Colors.greenAccent),
            ),
            Expanded(
              child: Container(
                height: 100,
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Text(
                      '赛事',
                      style: TextStyle(fontSize: 14),
                    ),
                    Container(
                      child: Row(
                        children: [
                          Container(
                            child: Icon(
                              Icons.loyalty_outlined,
                              size: 14,
                              color: Color.fromRGBO(153, 153, 153, 1),
                            ),
                          ),
                          Container(
                            child: Text(
                              '10月-11月/共3期',
                              style: TextStyle(
                                  color: Color.fromRGBO(153, 153, 153, 1),
                                  fontSize: 12),
                            ),
                          ),
                        ],
                      ),
                    ),
                    Container(
                      child: Row(
                        children: [
                          Container(
                            child: Icon(
                              Icons.place,
                              size: 14,
                              color: Color.fromRGBO(153, 153, 153, 1),
                            ),
                          ),
                          Container(
                            child: Text(
                              '南京出发 I 3天',
                              style: TextStyle(
                                  color: Color.fromRGBO(153, 153, 153, 1),
                                  fontSize: 12),
                            ),
                          ),
                        ],
                      ),
                    ),
                    Container(
                      child: Row(
                        mainAxisAlignment: MainAxisAlignment.end,
                        crossAxisAlignment: CrossAxisAlignment.end,
                        children: [
                          Container(
                            child: Text(
                              '￥',
                              style: TextStyle(
                                  fontSize: 11,
                                  color: Color.fromRGBO(191, 55, 54, 1)),
                            ),
                          ),
                          Container(
                            child: Text(
                              '999',
                              style: TextStyle(
                                  fontSize: 16,
                                  fontWeight: FontWeight.bold,
                                  color: Color.fromRGBO(191, 55, 54, 1)),
                            ),
                          ),
                          Container(
                            margin: EdgeInsets.only(left: 3),
                            child: Text(
                              '起',
                              style: TextStyle(
                                  fontSize: 9,
                                  color: Color.fromRGBO(102, 102, 102, 1)),
                            ),
                          )
                        ],
                      ),
                    ),
                  ],
                ),
              ),
            )
          ],
        ),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Row(
          children: [
            Container(
              width: 120,
              height: 50,
              child: TabBar(
                controller: widget.tabc,
                onTap: (val) {
                  setState(() {
                    tabIndex = val;
                  });
                },
                tabs: widget.tabs
                    .map((item) => Tab(
                          //  text: item['name'],
                          child: Text(item['name'],
                              style: TextStyle(fontWeight: FontWeight.bold)),
                        ))
                    .toList(),
                //  indicatorPadding: EdgeInsets.only(bottom: 1),
                labelColor: Color.fromRGBO(191, 55, 54, 1),
                unselectedLabelColor: Colors.black,
                indicator: UnderlinePainter(
                    borderSide: BorderSide(
                        width: 6.0, color: Color.fromRGBO(248, 235, 235, 1))),
              ),
            ),
            Expanded(
                child: Container(
              margin: EdgeInsets.only(right: 15),
              height: 30,
              decoration: BoxDecoration(
                  color: Color.fromRGBO(249, 249, 249, 1),
                  borderRadius: BorderRadius.circular(15)),
              padding: EdgeInsets.symmetric(horizontal: 20),
              child: TextField(
                decoration: InputDecoration(
                    border: InputBorder.none,
                    hintText: '请输入活动赛事名称',
                    hintStyle: TextStyle(fontSize: 13),
                    prefixIcon: Icon(
                      Icons.search,
                    ),
                    prefixIconConstraints: BoxConstraints(),
                    isDense: true),
              ),
            ))
          ],
        ),
        Container(
          padding: EdgeInsets.symmetric(horizontal: 15),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Row(
                children: [
                  Container(
                    child: SelectWidget(
                      items: [
                        MenuItem(label: '真的', value: '1'),
                        MenuItem(label: '假的', value: '2')
                      ],
                      label: '类型',
                      value: val,
                      valueChanged: valueChanged,
                    ),
                  ),
                  Container(
                    width: 0.5,
                    height: 12,
                    margin: EdgeInsets.only(left: 10),
                    color: Color.fromRGBO(153, 153, 153, 1),
                  ),
                  Container(
                    margin: EdgeInsets.only(left: 15),
                    child: SelectWidget(
                      items: [
                        MenuItem(label: '真的', value: '1'),
                        MenuItem(label: '假的', value: '2')
                      ],
                      label: '目的地',
                      value: val,
                      valueChanged: valueChanged,
                    ),
                  ),
                ],
              ),
              InkWell(
                onTap: () {},
                child: Container(
                  child: Icon(
                    Icons.call_to_action_outlined,
                    color: Color.fromRGBO(153, 153, 153, 1),
                  ),
                ),
              ),
            ],
          ),
        ),
        Container(
          margin: EdgeInsets.only(top: 10),
          height: 8,
          color: Color.fromRGBO(249, 249, 249, 1),
        ),
        Expanded(
          child: Container(
            padding: EdgeInsets.symmetric(horizontal: 12),
            height: 450,
            child: TabBarView(controller: widget.tabc, children: [
              Container(
                child: SingleChildScrollView(
                    child: Column(
                  children: [goodsItemWidget()],
                )),
              ),
              Container(
                child: SingleChildScrollView(
                  child: Column(
                    children: [matchItemWidget()],
                  ),
                ),
              )
            ]
                // widget.tabs
                //     .map((items) => Container(
                //             child: SingleChildScrollView(
                //                 child: Column(
                //           children: [
                //             goodsItemWidget(),
                //             goodsItemWidget(),
                //             goodsItemWidget(),
                //             goodsItemWidget(),
                //             goodsItemWidget(),
                //             goodsItemWidget(),
                //             goodsItemWidget()
                //           ],
                //         ))))
                //     .toList()

                ),
          ),
        ),
      ],
    );
  }
}
